var vm = new Vue({
    el: '#idvue',
    data() {
        return {
            title: '武汉仓',
            time: '2017-01-15',
            history: {
                name: '精蛋白锌胰岛素注射液',
                number: '',
                startTime: '2016-12-01',
                endTime: '2017-12-01',
            },
            goodslist: [{
                historicalTit: '精蛋白锌胰岛素注射液',
                historicalFormat: "400IU 10ml/支",
                historicalStock: "当前库存 11 件 352 支",
                historicalCompany: "江苏万邦生化医药股份有限公司",
                historicalBatch: "国药准字5362052H4",
            }],
            temperatureTime1: '2016-12-01  10:35 ~ 2016-12-10  11:35',
            temperatureProcess: "储存温控",
            // temperatureTime2: '2016-12-21  10:35 ~ 2016-12-10  11:35',
            processTit: "回放配送过程",

            tablelist1: [{
                    id: 1,
                    time: "2016-12-01    10:32",
                    process: "到货温控",
                    tablethtit: {
                        Datas: [{
                            no: '序号',
                            type: '业务类型',
                            invoice: '单据号',
                            number: '数量',
                            item: '件数',
                            batch: '批号',
                            temperature: '到货温度',
                            supplier: '供应商',
                        }],
                    },
                    tabletd: {
                        Datas: [{
                            no: '01',
                            type: '采购入库',
                            invoice: 'RKD20161201001',
                            number: '320',
                            item: '10',
                            batch: '2016083101',
                            temperature: '2.5℃',
                            supplier: '华润新龙医药有限公司',
                        }]
                    }
                },
                {
                    id: 2,
                    time: "2016-12-11 09:37",
                    process: "到货温控",
                    tablethtit: {
                        Datas: [{
                            no: '序号',
                            type: '业务类型',
                            invoice: '单据号',
                            number: '数量',
                            item: '件数',
                            batch: '批号',
                            temperature: '到货温度',
                            supplier: '供应商',
                        }],
                    },
                    tabletd: {
                        Datas: [{
                            no: '01',
                            type: '采购入库',
                            invoice: 'RKD20161201001',
                            number: '320',
                            item: '10',
                            batch: '2016083101',
                            temperature: '2.5℃',
                            supplier: '华润新龙医药有限公司',
                        }]
                    }
                }
            ],

            tablelist2: [{
                time: "2016-12-10  11:33",
                process: "出库温控",
                tablethtit: {
                    Datas: [{
                        no: '序号',
                        type: '业务类型',
                        invoice: '单据号',
                        number: '数量',
                        item: '件数',
                        batch: '批号',
                        temperature: '出库温度',
                        customer: '客户',
                        freezer: '冷藏箱',
                        box: '箱号',
                    }],
                },
                tabletd: {
                    Datas: [{
                        no: '01',
                        type: '销售出库',
                        invoice: 'CKD20161201001',
                        number: '20',
                        item: '0.625',
                        batch: '2016083101',
                        temperature: '2.5℃',
                        customer: '同济医院',
                        freezer: '1个',
                        box: 'C0001',
                    }]
                }
            }],
            tablelist3: [{
                time: "2016-12-01  11:35 ~ 2016-12-10  13:10",
                process: "配送温控",
                tablethtit: {
                    Datas: [{
                        no: '序号',
                        carnumber: '车牌号',
                        driver: '司机',
                        start: '启运地',
                        end: '目的地',
                        time: '配送时长',
                        temperature: '签收温度',
                        customer: '客户',
                        freezer: '冷藏箱',
                        box: '箱号',
                        salesnumber: '销售单号',
                    }],
                },
                tabletd: {
                    Datas: [{
                        no: '01',
                        carnumber: '鄂A0313',
                        driver: '王师明司机',
                        start: '江夏庙山',
                        end: '硚口区中山大道同济医院',
                        time: '1.5小时',
                        temperature: '2.5℃',
                        customer: '同济医院',
                        freezer: '1个',
                        box: 'C0001',
                        salesnumber: 'CKD20161201001',
                    }]
                }
            }],
            car: {
                cp: '鄂A0313',
                ck: '良好',
                xha: 'BXL5041XLC2',
                xhb: '4056×1756×1726',
                sj: '王师明',
                qy: '09:30',
                yxs: '1小时',
                dq: '10:35',
                wd: '2.1℃',
                wdnum: '60%',
                dd: '3单',
                pgs: '5个',
                kh: '3家',
                js: '28件',
                cwwd: '30℃'
            },
            map: {
                startadd: '北京天安门',
                endadd: '北京黄村',
                carpt: '116.37811,39.851817',
                starttitle: '冷库一'
            }

        }

    },
    methods: {
        getData: function() {
            //$ ajax 获取

            this.showChart();
            this.showChart2();
            this.maplines();
            $(this.$el).addClass('show');
        },
        showChart: function() {
            var self = this;
            var myChart = echarts.init(document.getElementById('temperatureCharts1'));
            var option = {
                baseOption: {
                    title: {
                        text: '温度曲线',
                        textStyle: {
                            color: '#00acf1',
                            fontSize: 14,
                        }
                    },
                    tooltip: {
                        trigger: 'axis',
                        backgroundColor: '#45b035',
                        formatter: '{c}°C',
                        borderRadius: 8,
                        axisPointer: { // 坐标轴指示器，坐标轴触发有效
                            type: 'none'
                        }
                    },
                    legend: {
                        data: self.title
                    },
                    grid: {
                        left: '0',
                        right: '2%',
                        bottom: '0',
                        containLabel: true
                    },
                    xAxis: {
                        type: 'category',
                        boundaryGap: false,
                        data: ['9:30', '9:35', '9:40', '9:45', '9:50', '9:55', '10:00', '10:05', '10:10', '10:15', '10:20', '10:25', '10:30'],
                    },
                    yAxis: {
                        type: 'value',
                        splitNumber: 5,
                        max: 10
                    },
                    series: [{
                        name: '温度曲线',
                        type: 'line',
                        symbolSize: 10, //图标尺寸
                        symbol: 'circle',
                        stack: '总量',
                        data: [2, 2.5, 3, 2.5, 3, 2.5, 3, 2.5, 3, 3.5, 2, 3, 2.5],
                        itemStyle: {
                            normal: {
                                color: "#45b035" //图标颜色
                            }
                        },
                        lineStyle: {
                            normal: {
                                color: "#45b035" //连线颜色
                            }
                        },

                    }]
                }
            };
            // 使用刚指定的配置项和数据显示图表。
            myChart.setOption(option);
        },

        showChart2: function() {
            var self = this;
            var myChart = echarts.init(document.getElementById('temperatureCharts2'));
            var option = {
                baseOption: {
                    title: {
                        text: '温度记录',
                        textStyle: {
                            color: '#00acf1',
                            fontSize: 14,
                        }
                    },
                    tooltip: {
                        trigger: 'axis',
                        backgroundColor: '#00aaeb',
                        formatter: '{c}°C',
                        borderRadius: 8,
                        axisPointer: { // 坐标轴指示器，坐标轴触发有效
                            type: 'none'
                        }
                    },
                    legend: {
                        data: self.title
                    },
                    grid: {
                        left: '0',
                        right: '2%',
                        bottom: '0',
                        containLabel: true
                    },
                    xAxis: {
                        type: 'category',
                        boundaryGap: false,
                        data: ['9:50', '9:55', '10:00', '10:05', '10:10', '10:15', '10:20', '10:25', '10:30'],
                    },
                    yAxis: {
                        type: 'value',
                        splitNumber: 5,
                        max: 10
                    },
                    series: [{
                        name: '温度曲线',
                        type: 'line',
                        symbolSize: 10, //图标尺寸
                        symbol: 'circle',
                        stack: '总量',
                        data: [3, 2.5, 3, 2.5, 3, 3.5, 2, 3, 2.5],
                        itemStyle: {
                            normal: {
                                color: "#00aaeb" //图标颜色
                            }
                        },
                        lineStyle: {
                            normal: {
                                color: "#00aaeb" //连线颜色
                            }
                        },

                    }]
                }
            };
            // 使用刚指定的配置项和数据显示图表。
            myChart.setOption(option);
        },
        maplines: function() {
            console.log('a')
                //setTimeout(function(){
            app.maplines('allmap', [this.map.startadd, this.map.endadd], this.map.carpt, this.map.starttitle,
                    '司机    ' + this.car.sj + '<br/>车牌 ' + this.car.cp + '<br/>订单 ' + this.car.dd + '<br/>品规数 ' + this.car.pgs + '<br/>' +
                    '客户 ' + this.car.kh + '<br/>件数 ' + this.car.js + '<br/>监控温度 ' + this.car.wd +
                    '<br/>监控温度 ' + this.car.wdnum + '<br/>车外温度 ' + this.car.cwwd)
                //}.bind(this),0)

        }


    },
    ready: function() {
        this.getData();

    }
})